<template>
	<view class="">

		<u-tabbar v-model="current" :list="tabbar"></u-tabbar>
		<view class="box w_h_100" v-if="current==0">

			<view class="bossx">
				<view class="d_f a_i_c j_c_s_b boss">
					<view class="d_f a_i_c">
						<image src="https://web.78keji.cn/yshimage/logo.png" mode="widthFix" style="width: 90rpx;">
						</image>
						<view class="" style="margin-left: 27rpx;" v-if="!mobile">
							请登录！！！
						</view>
						<view class="" v-else style="margin-left: 27rpx;">
							<view class="">
								欢迎您！！
							</view>
							<view class="" style="font-weight: bold;margin-top: 18rpx;">
								会员用户{{mobile}}
							</view>
						</view>
					</view>


					<view class="" v-if="!mobile">
						<button class="login" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">登录</button>
						<!-- 	<image src="https://web.78keji.cn/yshimage/login.png" mode="widthFix" style="width: 120rpx;"></image> -->
					</view>
				</view>
				<!-- 	<image src="https://web.78keji.cn/yshimage/bg.png" mode="widthFix" style="width: 100%;"></image> -->
			</view>
			<view class="banner" v-if="is==0">
				<image src="https://web.78keji.cn/yshimage/banner.png" mode="widthFix" style="width: 100%;"
					>
				</image>
			</view>
			<view class="bottom">
				<view class="columnx" style="position: relative;">
					<template v-for="(item,index) in listt ">
						<view :key='index' @tap="changexx(item.name)" class="bindx">

							<image :src='item.img' mode="aspectFill" class="bracelet"></image>

							<view class="binding">
								{{item.name}}
							</view>
						</view>
					</template>
				</view>
				<view class="second" v-if="is==0">
					<view style="position: relative;">
						<view class="d_f serd " style="margin-top: 34rpx;">
							<view class="">
								——
							</view>
							<view class="card">
								热门权益
							</view>

							<view class="">
								——
							</view>
						</view>
					</view>
				</view>
				<view class="images d_f" v-if="is==0">
					<view class="">
						<image src="https://web.78keji.cn/yshimage/keep.png" mode="widthFix" style="width:364rpx;"
							></image>
					</view>
					<view class="" style="padding-left: 21rpx;">
						<image src="https://web.78keji.cn/yshimage/ng.png" mode="widthFix" style="width:290rpx;"
							></image>
						<image src="https://web.78keji.cn/yshimage/xmly.png" mode="widthFix"
							style="width:290rpx;margin-top: 18rpx;"></image>
					</view>
				</view>

			</view>
			<view class="" style="height: 150rpx;">

			</view>






		</view>
		<view class="bottoms" v-else>
			<view class="" v-for="(item,index) in lists " :key='index' v-if="is==0">
				<image :src='item.image' style="width: 100%;margin-top: 26rpx;height: 180rpx;" @tap="changes(item.url)">
				</image>
			</view>
			<view class="" v-if="is==1">

				<view class="d_f j_c_c serd" style="margin-top: 200rpx;">
					<view class="">
						——
					</view>
					<view class="card">
						暂无权益
					</view>

					<view class="">
						——
					</view>
				</view>

			</view>
		</view>
	</view>
</template>


<script>
	import {
		wxLogin,
		openSignDecrypt,
		getBanner,
		shenhe,
		getLog,
		getPhone,
		wxLogins

	} from '../../api/index.js'
	import phoneApi from "../../api/phoneApi";
	export default {
		data() {

			return {
				lists: [],
				current: 0,
				tabbar: [{
						iconPath: "https://web.78keji.cn/yshimage/indexno.png",
						selectedIconPath: "https://web.78keji.cn/yshimage/index.png",
						text: '首页',
						midButton: true,
						customIcon: false
					},

					{
						iconPath: "https://web.78keji.cn/yshimage/quanyino.png",
						selectedIconPath: "https://web.78keji.cn/yshimage/quanyi.png",
						text: '热门权益',
						midButton: true,
						customIcon: false,
					}
				],

				openid: '',
				mobile: "",
				is: '',
				listt: [{
						img: 'https://web.78keji.cn/yshimage/shiping.png',
						name: "视频会员"
					},
					{
						img: 'https://web.78keji.cn/yshimage/stop.png',
						name: "停车券"
					},
					{
						img: 'https://web.78keji.cn/yshimage/lijianjin.png',
						name: "立减金"
					},
					{
						img: 'https://web.78keji.cn/yshimage/chongdian.png',
						name: "充电券"
					},

				],



			}
		},
		components: {

		},
		methods: {
			youku() {

				let url = 'https://11.syhy000.com/yktc/#/?a=c4889be2732e5f40377fb23859f76cd1&mobile=' + this.mobile
				uni.setStorageSync('url', url)
				uni.navigateTo({
					url: '/pages/shiping/shiping'
				})
			},
			ng() {
				let url = 'https://ng.78keji.cn/newljj/#/?a=c4889be2732e5f40377fb23859f76cd1&mobile=' + this.mobile
				uni.setStorageSync('url', url)
				uni.navigateTo({
					url: '/pages/shiping/shiping'
				})
			},
			keep() {
				let url = 'http://keep.syhy000.com/keep/29/#/?a=c4889be2732e5f40377fb23859f76cd1&mobile=' + this.mobile
				uni.setStorageSync('url', url)
				uni.navigateTo({
					url: '/pages/shiping/shiping'
				})

			},
			changes(e) {
				console.log(e) //h5链接
				uni.setStorageSync('url', e)
				uni.navigateTo({
					url: '/pages/shiping/shiping'
				})
			},
			changexx(item) {
				console.log(item)
				if (item == '充电券') {
					uni.navigateTo({
						url: '/pages/ljjlq/ljjlq'
					})
				} else if (item == '立减金') {
					uni.navigateTo({
						url: '/pages/ljjlq/ljjlq'
					})
				} else if (item == '停车券') {
					let url = 'https://ng.78keji.cn/newtcq/#/pages/coupon_type/coupon_type?mobile=' + this.mobile +
						'&openid=' + this.openid + '&token=' + uni.getStorageSync('token')
					console.log(url)
					uni.setStorageSync('url', url)
					uni.navigateTo({
						url: '/pages/shiping/shiping'
					})

				} else if (item == '视频会员') {

					let url = 'https://ng.78keji.cn/pzb/lingqu/#/pages/coupon/coupon?mobile=' + this.mobile + '&openid=' +
						this.openid + '&token=' + uni.getStorageSync('token')
					console.log(url)
					uni.setStorageSync('url', url)
					uni.navigateTo({
						url: '/pages/shiping/shiping'
					})

				}
			},
			getdata() {
				shenhe({
					pid: 1,
					ver: 709
				}).then((res) => {
					console.log(res)
					this.is = res.data.is
					if (res.data.is == 0) {

						getBanner().then((res) => {
							console.log(res)
							this.baner = res.data.banner
							this.lists = res.data.ad
							this.list3 = res.data.list3
							if (this.list3.length > 0) {
								this.show = true
							}
							this.list4 = res.data.list4
							if (this.list4.length > 0) {
								console.log()
								this.shows = true
							}
						})
					}
				})

			},
			onAuthError(err) {
				console.log(err)
				this.time = 1
			},
			getPhoneNumber(e) {
				console.log(e)
				if (e.detail.code) {
					getPhone({
						openid: uni.getStorageSync('openidHF'),
						code: e.detail.code
					}).then((res) => {
						console.log(res)
						uni.setStorageSync('openid', res.data.openid)
						uni.setStorageSync('mobile', res.data.mobile)
						this.openid = uni.getStorageSync('openid')
						this.mobile = uni.getStorageSync('mobile')
						uni.setStorageSync('token', res.data.token)
					})

				} else {
					// console.log('getPhoneNumber')
					// this.isShowInput = true
				}
			},




		},
		onLoad(option) {

			this.getdata()


			if (uni.getStorageSync('openid')) {

				this.openid = uni.getStorageSync('openid')
			}
			if (uni.getStorageSync('mobile')) {

				this.mobile = uni.getStorageSync('mobile')

			}
			//#ifdef MP-WEIXIN
			if (!uni.getStorageSync('openidHF')) {

				uni.login({
					provider: 'weixin', //使用微信登录
					success: function(loginRes) {
						console.log(loginRes.code);
						// uni.setStorageSync('codexs', loginRes.code)
						wxLogins({
							code: loginRes.code,
							type: 3,
							proid: ""
						}).then((resx) => {
							uni.setStorageSync('openidHF', resx.data.openidH5)

							console.log(resx, 1111)
						})

					}
				});
			}

			//#endif



		},
		watch: {

		},
		computed: {

		}
	}
</script>

<style scoped lang='scss'>
	.bottom {
		width: 750rpx;
		padding: 45rpx 24rpx 33rpx 24rpx;
		background: #F7F7F7;
		border-radius: 41rpx;

	}

	.bottoms {
		width: 750rpx;
		padding: 45rpx 24rpx 33rpx 24rpx;

		border-radius: 41rpx;

	}

	.bossx {
		background-image: url('https://web.78keji.cn/yshimage/bg.png');
		background-size: 100% 100%;
		height: 497rpx;
	}

	.boss {
		padding: 25rpx 23rpx 0 40rpx;


	}

	.login {
		width: 120rpx;
		height: 42rpx;
		background: #000000;
		border-radius: 20rpx;
		color: white;
		font-size: 24rpx;
		line-height: 42rpx;
	}

	.banner {
		padding: 0 24rpx 24rpx 24rpx;
		background-color: white;
		margin-top: -20rpx;

	}

	.columnx {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
		height: 235rpx;
		border-radius: 10rpx;
		background: #FFFFFF;
	}

	.bindx {
		width: 25%;



		padding: 14rpx 0 14rpx 0;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.bracelet {
		width: 96rpx;
		height: 96rpx;
	}

	.binding {
		margin-top: 20rpx;
	}

	.second {
		font-size: 30rpx;
		font-weight: bold;
		display: flex;
		justify-content: center;
	}

	.card {
		padding: 0 14rpx 0 14rpx;
	}

	.images {
		padding-top: 33rpx;
		padding-left: 12rpx;

	}
</style>